<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- 避免IE使用兼容模式 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
<meta name="renderer" content="webkit">
<!-- TopJUI框架样式 -->
<link type="text/css" href="../../topjui/themes/default/topjui.core.min.css" rel="stylesheet">
<link type="text/css" href="../../topjui/themes/default/topjui.blue.css" rel="stylesheet" id="dynamicTheme" />
<!-- FontAwesome字体图标 -->
<link type="text/css" href="../../statics/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
<!-- layui框架样式 -->
<link type="text/css" href="../../statics/plugins/layui/css/layui.css" rel="stylesheet" />
<!-- jQuery相关引用 -->
<script type="text/javascript" src="../../statics/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript" src="../../statics/plugins/jquery/jquery.cookie.js"></script>
<!-- TopJUI框架配置 -->
<script type="text/javascript" src="../../statics/public/js/topjui.config.js"></script>
<!-- TopJUI框架核心-->
<script type="text/javascript" src="../../topjui/js/topjui.core.min1.js"></script>
<!-- TopJUI中文支持 -->
<script type="text/javascript" src="../../topjui/js/locale/topjui.lang.zh_CN.js"></script>
<!-- layui框架js -->
<script type="text/javascript" src="../../statics/plugins/layui/layui.js" charset="utf-8"></script>

<script type="text/javascript" src="../../statics/plugins/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="../../statics/plugins/ueditor/ueditor.all.min.js"></script>
<script type="text/javascript" charset="utf-8" src="../../statics/plugins/ueditor/lang/zh-cn/zh-cn.js"></script>
<!-- 上传组件 -->
<link type="text/css" rel="stylesheet" href="../../statics/plugins/webuploader/css/webuploader.css">
<script type="text/javascript" src="../../statics/plugins/webuploader/js/webuploader.min.js"></script>
</head>
<body>
<div class="topjui-container">
    <fieldset>
        <legend>由excel文件导入员工信息</legend>
    </fieldset>
	<form id='inputFileForm' data-toggle="topjui-form" method="post" enctype="multipart/form-data">
    <div class="topjui-row">
        <div class="topjui-col-sm8">
            <label class="topjui-form-label">请选择文件：</label>
            <div class="topjui-input-block">
                <input type="text" name="userFile" id="userFile"
                       data-toggle="topjui-filebox"
                       data-options="prompt:'请选择Excel文件',buttonIcon:'fa fa-file',
				                     accept:'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel'
                       ">
            </div>
        </div>
        <div class="topjui-col-sm4">
            <div class="topjui-input-block">
                 <a href="javascript:importExcel()" data-toggle="topjui-menubutton" id="btnUpload"
			data-options="btnCls:'topjui-btn-red'">导入</a> 
            </div>
        </div>
    </div>
    </form>
</div>
<script>
$(function(){ 
	//上传文件到服务器：
	/*
	$("#btnUpload").click(function () {
	    $('#inputFileForm').form('submit', {
	        url: '/report/importusers',
	        success: function (result) {
	            alert(result);
	            $("#userFile").filebox('reset');
	        }
	    });
	});
	*/
});

function importExcel() {
    //alert("进入导入方法");
	//获取form数据
    var formData = new FormData($("#inputFileForm")[0]);
    //$.messager.progress();
    //调用controller后台方法，将form数据传递给后台处理。contentType必须设置为false,否则chrome和firefox不兼容
    $.ajax({
        url: "/report/importusers",
        type: 'POST',
        data: formData,
        async: false,
        cache: false,
        contentType: false,
        processData: false,
        success: function (returnInfo) {
            //上传成功后将控件内容清空，并显示上传成功信息
            //$.messager.progress('close');	// 隐藏进度条
            $.messager.alert("导入成功");
            $("#userFile").filebox('reset');
         },
        error: function (returnInfo) {
            //上传失败时显示上传失败信息
        }
    });

}
</script>
</body>
</html>